<template>
	<!-- 地图分布 -->
	<view class="">
		<map style="width: 100%; height: 100vh;" :scale="10" :latitude="latitude" :longitude="longitude" :markers="covers" @markertap="markertap">
		</map>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0, // 使用 marker点击事件 需要填写id
				title: 'map',
				latitude: '',
				longitude: '',
				covers: [],
			}
		},
		onLoad() {
			this.getInfo();
		},
		methods: {
			markertap(e){
				this.covers.map(v=>{
					if(v.id==e.detail.markerId){
						let that=this;
						uni.openLocation({
							latitude:Number(v.latitude),
							longitude:Number(v.longitude),
							name:v.supname,
							address:v.address,
							success() {
								console.log('OK');
							},
							fail(err) {
								that.$api.msg('请重试');
							}
						})
					}
				})
			},
			getInfo(){
				var that=this;
				uni.getLocation({
					type: 'gcj02',
					success(v) {
						that.longitude=v.longitude;
						that.latitude=v.latitude;
					},
					fail(err) {
						that.$api.msg('位置获取失败，请重试')
					}
				})
				this.$axios('o2o/getAllMrech','POST','shop').then(res=>{
					if(res.data.code==200){
						this.covers=res.data.data.map(v=>({
							supname:v.supname,
							address:v.address,
							id:v.uid,
							latitude:v.y,
							longitude:v.x,
							iconPath:'/static/location@3x.png',
						}))
					}
				})
			}
		}
	}
</script>

<style>
</style>
